<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
	<meta charset="utf-8">
	<meta name="renderer" content="webkit">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no,shrink-to-fit=no">
	<meta name="theme-color" content="#000000">
	<meta name="format-detection" content="telephone=no">
	<meta name="format-detection" content="email=no">
	<meta name="viewport" content="width=device-width,initial-scale=1">
	<link rel="shortcut icon" href="favicon.ico">
	<title>酷办</title>
	<link rel="stylesheet" href="/js/plugin/layui-v2.3.0/layui/css/layui.css">
	<link rel="stylesheet" href="/css/reset.css">
	<link rel="stylesheet" href="/css/client.css">
	<link rel="stylesheet" href="/css/index.css">
	<script src="/js/jquery-2.1.1.min.js"></script>
	<script src="/js/plugin/layui-v2.3.0/layui/layui.js"></script>
	<style type="text/css">
	.layui-tab-title .layui-badge, .layui-tab-title .layui-badge-dot {
    left: 30px;
    top: 18px;
    border-radius:50%;
}
	</style>
</head>
<body class="layui-layout-body">
	<input type="hidden" id="projectId" name="projectId" value="" />
	<div class="layui-layout layui-layout-admin">
		<div class="layui-header my-header layui-tab layui-tab-brief"  lay-filter="headerNav">
			<div class="layui-logo "><img src="images/jintai_logo.png" alt="logo"></div>
			<!-- 头部区域（可配合layui已有的水平导航） -->
		    <ul class="layui-nav layui-layout-left layui-tab-title " >
		      <li class="layui-nav-item" lay-id="projectIndex"><a href="#projectIndex">首页</a></li>
		      <li class="layui-nav-item" lay-id="team"><a href="#team">团队</a></li>
		      <li class="layui-nav-item" lay-id="station"><a href="#station">工位</li>
		      <li class="layui-nav-item" lay-id="crm"><a href="#crm">客户</a></li>
		      <li class="layui-nav-item" lay-id="contract"><a href="#contract">合同</a></li>
		      <li class="layui-nav-item" lay-id="field"><a href="#field">场地</a></li>
		      <li class="layui-nav-item" lay-id="door"><a href="#door">门禁</a></li>
		      <li class="layui-nav-item" lay-id="visit"><a href="#visit">访客</a></li>
		      <li class="layui-nav-item" lay-id="employee"><a href="#employee">员工</a></li>
		      <li class="layui-nav-item" lay-id="statistic"><a href="#statistic">统计</a></li>
		      <li class="layui-nav-item" lay-id="report"><a href="#report">报表</a></li>
		      <li class="layui-nav-item" lay-id="setting"><a href="#setting">设置</a></li>
		      <li class="layui-nav-item" lay-id="msg"><a href="#msg">消息 <span class="layui-badge" id="msgCount"></span></a></li>
		    </ul>
		    <ul class="layui-nav layui-layout-right my-header-pic">
		      <li class="layui-nav-item">
		        <a href="javascript:;">
		        <img th:if="${user.sysAttachmentPortrait!=null}" th:src="|${user.sysAttachmentPortrait.filePath}${user.sysAttachmentPortrait.id}${user.sysAttachmentPortrait.fileType}|"  class="layui-nav-img">
				<img th:if="${user.sysAttachmentPortrait==null}" src="/images/132.png"  class="layui-nav-img">
		        </a>
		        <dl class="layui-nav-child">
		          <dd><a href="javascript:;" onclick="set()">设置</a></dd>
		          <dd><a href="javascript:;">退出</a></dd>
		        </dl>
		      </li>
		    </ul>
		</div>
 		<div class="layui-body">
 		<div style="position: relative;">
			<div class="sub-nav-bar1">
				<div style="position: relative;">
					<div class="line-move"></div>
					<div class="bar-address" style="margin-top:7px;"><a href="javascript:void(0)"><span id="projectName"></span><i class="layui-icon layui-icon-right shop-down"></i></a></div>
					<div class="bar-drop-down hide">
						<div class="city-list">
							<ul class="company-name clear-fix" id="projectList">
							</ul>
						</div>
					</div>
				</div>
			</div>
		</div>
		    <div class="iframe-wrap">
		    	<!-- <iframe id="index-iframe" src="" frameborder="0" width="100%" height="100%"></iframe> -->
		    </div>
		</div>
	</div>
</body>
<div class="form-wrap" style="display:none" id="power-formwrap">
	<form class="layui-form" action="" lay-filter="power-form">
		<div class="layui-form-item">
			    <label class="layui-form-label"><span class="must-fill">*</span>分店</label>
			    <div class="layui-input-block">
			      <select name="shop" xm-select="shop" xm-select-skin="normal" lay-filter="shop">
			      </select>
			    </div>
		</div>
		<div class="layui-form-item">
			    <label class="layui-form-label"><span class="must-fill">*</span>角色</label>
			    <div class="layui-input-block">
			      <select name="role" xm-select="role" xm-select-skin="normal" lay-filter="role">
			      </select>
			    </div>
		</div>
		<div class="layui-form-item" style="position: fixed;">
			    <div class="layui-input-block">
			      <button class="layui-btn layui-btn-normal" lay-filter="formEmployee" >取消</button>
			      <button type="" class="layui-btn layui-btn-primary" id="submit-btn" lay-submit >保存</button>
			    </div>
		</div>
	</form>	
</div>
<script>
	$(function(){
		
		getProject();
		getHash();
		getMessageCount();
		/* window.addEventListener("popstate", function(e) { 
				 getHash();	 
		}, false); */
		layui.use(['element','layer','table'], function(){
			var element = layui.element, layer=layui.layer;
			  //获取hash来切换选项卡，假设当前地址的hash为lay-id对应的值，头部的导航
			  element.on('tab(headerNav)', function(data){
			    var layid = this.getAttribute('lay-id');
			    location.hash = layid;
			    console.log(1)
			    getHash()//根据路由，显示当前内容
			  }); 
		  
		});
		//切换分店
		var toggle=true;
		$(".bar-address").on("click",function(){
			if(toggle){
				$(this).children().children("i").addClass("layui-icon-down").removeClass("layui-icon-right");
				$(this).next().addClass("show").removeClass("hide");
				toggle=false;
			}else{
				$(this).children().children("i").addClass("layui-icon-right").removeClass("layui-icon-down");
				$(this).next().addClass("hide").removeClass("show");
				toggle=true;
			}
		})
		//赋值分店
		$('.sub-nav-bar1').on("click","li",function(){
			var txt=$(this).text();
			var id=$(this).attr("id");
			$("#projectId").val(id);
			$(".bar-address").children().children('span').text(txt);
			$(".bar-address").children().children("i").addClass("layui-icon-right").removeClass("layui-icon-down");
			$(".bar-drop-down").addClass("hide").removeClass("show");
			toggle=true;
			getHash();
		})
		
		
	})
	function getHash(){
		var layid = location.hash.substr(1),iframeSrc="",hashId='';
		var projectId = $("#projectId").val();
		$(".sub-nav-bar").hide();
		$(".layui-tab-title li[lay-id]").removeClass("layui-this");
		if(layid==""||layid=='undefined'||layid==null||layid.indexOf("projectIndex")!= -1){//首次进来，项目
			iframeSrc='/app/project/indexSecond/'+projectId;
			$('.sub-nav-bar1').show();
			layid="projectIndex";
		}
/* 		if(layid=="projectIndex"){//首页
			iframeSrc='/app/project/indexSecond/'+projectId;
			$('.sub-nav-bar1').show();
		} */
		if(layid=='team'){//团队
			iframeSrc='/app/customerTeam/list/'+projectId;
			$('.sub-nav-bar1').show();
		}else if(layid=='station'){//工位
			iframeSrc='/app/projectStation/index';
			$('.sub-nav-bar1').show();
		}else if(layid=='contract'){//合同
			iframeSrc='/app/contractInfo/index';
			$('.sub-nav-bar1').hide();
		}else if(layid=='field'){//场地
			iframeSrc='/app/projectField/index';
			$('.sub-nav-bar1').show();
		}else if(layid=='door'){//门禁
			iframeSrc='/app/projectDoor/index';
			$('.sub-nav-bar1').show();
		}else if(layid=='visit'){//方可
			iframeSrc='/app/customerVisit/index';
			$('.sub-nav-bar1').show();
		}else if(layid.indexOf("employee")!= -1){//员工管理
			iframeSrc='/system/org/user/index';	
			$('.sub-nav-bar1').hide();
		}else if(layid=='crm'){//客户管理	    	
	    	iframeSrc='/app/customerInfo/list';	
	    	$('.sub-nav-bar1').hide();
		}else if(layid =='setting'){//空间设置
			iframeSrc='/app/project/setting';
			$('.sub-nav-bar1').show();
		}else if(layid=='msg'){//消息
			iframeSrc='/app/message/list';
			$('.sub-nav-bar1').hide();
		}else if(layid=='statistic'){
			iframeSrc='/app/statistical/index';
			//$('.sub-nav-bar1').hide();
		}
		
		
		
		//二级导航页面路径的配置；
		if(layid.indexOf("employeeDetials")!= -1){//员工管理-员工的详情页面
			hashId=layid.substring(layid.indexOf("/")+1);
			iframeSrc="/system/org/user/details/"+hashId;
			layid='employee';
			
		} 
	    /* if(layid.indexOf("projectIndex")!= -1){//分店-首页页面
	    	hashId=layid.substring(layid.indexOf("/")+1);
		    iframeSrc='/app/project/index/'+hashId;
		    layid='locations';
	    }  */
		$(".layui-tab-title li[lay-id='"+layid+"']").addClass("layui-this");
		var iframe = document.createElement('iframe');//动态创建iframe，禁止iframe的src回退；
	    iframe.src = iframeSrc;
	    iframe.width = '100%';
	    iframe.height = '100%';
	    iframe.id= 'iframe-top';
	    $(".iframe-wrap").html($(iframe));
		//$("#index-iframe").attr("src",iframeSrc);	
	}
	function set(){
		iframeSrc='/system/org/user/toSetIndex';	
		var iframe = document.createElement('iframe');//动态创建iframe，禁止iframe的src回退；
	    iframe.src = iframeSrc;
	    iframe.width = '100%';
	    iframe.height = '100%';
	    iframe.id= 'iframe-top';
	    $(".iframe-wrap").html($(iframe));
	}
	function setSrc(iframeSrc){
		var iframe = document.createElement('iframe');//动态创建iframe，禁止iframe的src回退；
	    iframe.src = iframeSrc;
	    iframe.width = '100%';
	    iframe.height = '100%';
	    $(".iframe-wrap").html($(iframe));
	}
	//封装获取数据
	function getProject(){
	　	var url="/app/project/listdata";
		jQuery.ajax({
	        type:"post",
	        async:false,
	        url:url,
	        dataType:"json",
	        data:{},
	        success:function(data){
	        	var con="";
	        	for (var i = 0; i < data.data.length; i++) {
	        		if(i==0){
	        			$("#projectName").html(data.data[i].projectName);
	        			$("#projectId").val(data.data[i].id);
	        		}
	        			con+='<li id="'+data.data[i].id+'"><a href="javascript:void(0)">'+data.data[i].projectName+'</a></li>';
	        		
	        	}
	        	$("#projectList").html(con);
	        }
	    })
	}
	//获取未读消息数
	function getMessageCount(){
		var url = "/app/message/user/getMsgCount";
		$.post(url,function(result){
			if(result > 0){
				$("#msgCount").text(result);
				$("#msgCount").show();
			}else{
				$("#msgCount").hide();
			}
		   
		  });
	}
</script>
</html>